import 'package:flutter/material.dart';
import 'package:lzj_demo/bean/user_info.dart';
import 'package:lzj_demo/network/api_service.dart';
import 'package:lzj_demo/utils/toast_util.dart';
import 'package:lzj_demo/widget/drawer_widget.dart';

class MyPage extends StatefulWidget {
  const MyPage({super.key});

  @override
  State<StatefulWidget> createState() => _ArticalDetailPageState();
}

class _ArticalDetailPageState extends State<MyPage> {
  UserInfo userInfo = UserInfo();

  @override
  void initState() {
    getUserInfo();
    super.initState();
  }

  //todo 获取用户信息
  getUserInfo() async {
    UserInfo bean = await ApiService.getUserInfo({});
    print("userInfo===>  " + bean.name.toString());
    setState(() {
      userInfo = bean;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      //todo 抽屉通常与 AppBar 的 leading 属性配合使用，以在应用栏上添加一个按钮来打开抽屉。你可以在 AppBar 中使用 IconButton 并在 onPressed 回调中调用 ScaffoldState.openDrawer() 方法来实现这一功能。
      appBar: AppBar(
          title: const Text(
            "我的",
            style: TextStyle(color: Colors.white),
          ),
          centerTitle: true,
          backgroundColor: Colors.purpleAccent,
          leading: Builder(builder: (context) {
            return IconButton(
                onPressed: () {
                  Scaffold.of(context).openDrawer();
                },
                icon: const Icon(Icons.menu));
          })),
      //todo 抽屉布局
      drawer: const DrawerWidget(des: "抽屉  Header"),
      //todo Stack作为根部件，并在其中放置了两个Positioned小部件。每个Positioned小部件都有top和left属性，用于指定子部件相对于Stack的位置。
      body: Stack(
        children: [
          //todo 结合stack可以设置固定位置
          Positioned(
            bottom: 50,
            left: 0,
            right: 0,
            child: Container(
              width: 100,
              height: 50,
              margin: const EdgeInsets.fromLTRB(16, 0, 16, 0),
              // color: Colors.red,
              child: ElevatedButton(
                onPressed: () {
                  // 按钮点击事件处理逻辑
                  ToastUtil.toast("退出成功");
                },
                child: const Text(
                  '退出登录',
                  style: TextStyle(fontSize: 18),
                ),
              ),
            ),
          ),
          Column(
            children: [topContainer()],
          ),
        ],
      ),
    );
  }

  //todo 头部视图
  // ignore: non_constant_identifier_names
  Widget topContainer() {
    return Container(
      margin: const EdgeInsets.fromLTRB(16, 30, 16, 30),
      child: Row(
        children: [
          Container(
              //给网络图片切圆形
              width: 50,
              height: 50,
              clipBehavior: Clip.hardEdge,
              decoration:
                  BoxDecoration(borderRadius: BorderRadius.circular(50)),
              child: Image.network(userInfo.headImg.toString())),
          // Image.network(userInfo!.headImg.toString(), width: 50, height: 50),
          const SizedBox(
            width: 16,
          ),
          Expanded(
            child: Text(
              userInfo.name.toString(),
              style: const TextStyle(fontSize: 18, color: Colors.black),
            ),
          ),
          const Icon(Icons.navigate_next_sharp)
        ],
      ),
    );
  }
}
